<template>
    <div class="seckill">
        <div class="top">
            <p>京东秒杀</p>
            <div class="time">
                <span>01</span>
                <span>:</span>
                <span>29</span>
                <span>:</span>
                <span>25</span>
            </div>
            <div class="msr">
                <span>水星秒杀日</span><span class="span1">></span>
            </div>
        </div>
        <div class="list">
            <div class="item">
                <img src="//m.360buyimg.com/seckillcms/s150x150_jfs/t1/42659/39/19021/278926/63228211Ecd81681d/86177fff33365fa5.jpg.dpg" alt="">
                <span>￥5649</span>
            </div>
            <div class="item">
                <img src="//m.360buyimg.com/seckillcms/s150x150_jfs/t1/121435/15/26157/187902/634905abE009a5b7a/cce406fe8bfc62d2.jpg.dpg" alt="">
                <span>￥19.9</span>
            </div>
            <div class="item">
                <img src="//m.360buyimg.com/seckillcms/s150x150_jfs/t1/39972/22/19978/150548/634cb4a8Ef77c74bd/a0710b086275626b.jpg.dpg" alt="">
                <span>￥610</span>
            </div>
            <div class="item">
                <img src="//m.360buyimg.com/seckillcms/s150x150_jfs/t1/135669/24/25402/74695/631b0c09E958cb378/d8ef27bcd6722276.jpg.dpg" alt="">
                <span>￥379</span>
            </div>
            <div class="item">
                <img src="//m.360buyimg.com/seckillcms/s150x150_jfs/t1/171143/32/12993/335993/6050797eE4b9f6076/ae7887d0170c7479.jpg.dpg" alt="">
                <span>￥74.9</span>
            </div>
            <div class="item">
                <img src="//m.360buyimg.com/seckillcms/s150x150_jfs/t1/167105/17/28365/62255/634c39e1Ee27c1b2f/67569b2580b47276.jpg.dpg" alt="">
                <span>￥259</span>
            </div>
        </div>
    </div>
</template>

<script>
export default{
    name:'Seckill',
    data(){
        return{
            msg:'这是秒杀！',
        };
    },
};
</script>

<style lang="scss" scoped>
    .seckill{
        width: 680px;
        height: 280px;
        background-color: #FFFFFF;
        margin: 20px auto;
        font-size: 28px;
        border-radius: 30px;
        span{
            color: red;
        }
        .top{
            line-height: 25px;
            display: flex;
            justify-content: space-around;
            padding-top: 20px;
            .span1{
                width: 25px;
                height: 25px;
                display: inline-block;
                background-color: red;
                color: white;
                border-radius: 50%;
                
            }
        }
        .list{
            display: flex;
            height: 240px;
            justify-content: space-around;
            .item{
                // width: 16%;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
            }
            img{
                width: 90px;
            }
            span{
                font-size: 26px;
                padding-top: 20px;
            }
        }
    }
</style>